Layui自定义模块的使用方式 |
您所在的位置：网站首页 › layui 自定义模块 内属性 › Layui自定义模块的使用方式 |
Layui自定义模块的使用方式
|
以下是官方样例 说明 https://www.layui.com/doc/base/modules.html#extend 按照官方给的例子 顺序大概是 步骤如下： 第一步：新建一个js文件 写 一个 模块 该模块写在一个JS文件中如： XX模块.js，目录自选（不在layui的目录下）在 myFirstModel.js文件中 代码如下 可以直接拷贝到一个空白的js文件中 文件名称 为myFirstModel.js layui.define(function (exports) { // 设置对象 可在对象里面设置相关的 属性或者方法 var defineFunc = { objs:"objs 参数", init: function (some) { alert("init defineFunc" + some) }, getData: function () { alert("getData defineFunc") } }; //输出模块 参数说明 //参数一 是供别人调用时识别的模块接口的名称 //第二个参数为该模块中的可调用的对象，通过该对象可以调用指定的模块中的方法 // 注意 该接口的名称必须和js的文件名相同（此处的js的文件为myFirstModel.js），否则将模块无法被调用。 exports('myFirstModel', defineFunc); }); 第二步：调用定义好的模块，在html 页面和js上都可以调用：第二步的调用有两种方法： 第一：使用layui.config 全局定义 //方法 1 //设置模块 layui.config({ base: './static/js/'//假设这是你存放拓展模块的根目录 }).extend({ //设定模块别名 myFirstModel: 'myFirstModel' }); // 使用模块 layui.use(['myFirstModel'], function () { var def = layui.myFirstModel; var objs = def.objs; def.init(objs); def.getData(); });第二：使用layui.extend 再use // 方法 2 //layui扩展模块的两种加载方式 - 示例 layui.extend({ myFirstModel: '{/}../../static/js/myFirstModel' // {/}的意思即代表采用自有路径，即不跟随 base 路径 }); //使用拓展模块 layui.use('myFirstModel', function () { var mym = layui.myFirstModel mym.hello(' 使用了方法2'); //弹出 Hello World! });注意： base属性，指明js所定义的模块的相对（相对于根目录）路径 以上 myFirstModel: 'myFirstModel' //key和value一般一样，此值和输出接口的名称相同 最后结果如下：
参考： https://blog.csdn.net/jialijuan521_zhang/article/details/73556776 请看这篇 这篇文章说的东西很有用 ，它讲述了多种的定义方式和各种方式的调用方法 https://www.cnblogs.com/hss-blog/articles/9055706.html |
【本文地址】
今日新闻 |
推荐新闻 |